<template>
    <div>
        <el-table
          v-loading="loading"
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.8)"
          :data="users">
            <el-table-column prop="id" label="编号" width="180"></el-table-column>
            <el-table-column prop="uname" label="用户名" width="180"></el-table-column>
            <el-table-column prop="businessImg" label="营业执照" width="180">
              <template slot-scope="scope">
                <div class="demo-image__preview">
                  <el-image
                    style="width: 100px; height: 100px"
                    :src="'http://127.0.0.1:9090/demo/'+scope.row.businessImg">
                  </el-image>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="可提供的商品分类">
              <template slot-scope="scope">
                <el-popover
                  placement="top-start"
                  title="分类如下："
                  width="200"
                  trigger="hover"
                  :content="scope.row.supplierGoodsCategoryName">
                  <el-button slot="reference">查看供应商提供的分类</el-button>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" type="primary" @click="audit(scope.row.id,1)">允许通过</el-button>
                    <el-button size="mini" type="danger" @click="audit(scope.row.id,2)">拒绝通过</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div>
            <!-- 分页 -->
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pageno"
                    :page-sizes="[5, 10, 15, 20]"
                    :page-size="pagesize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
            >
            </el-pagination>
        </div>
    </div>
</template>

<script>
    export default {
        name: "supplier_check",
        data(){
            return {
                user:{
                    supplierState:0,//供应商等待审核
                    accountState:0//状态为正常
                },
                users:[],
                pageno: 1,
                pagesize: 5,
                total: 1,
                loading: true
            };
        },
        methods:{
            getData(){
                let params=new URLSearchParams();
                params.append("pageno", this.pageno);
                params.append("pagesize", this.pagesize);
                Object.keys(this.user).forEach(item=>{
                    params.append(item,this.user[item]);
                })
                //调用异步，查询供应商等待审核并且状态为正常的用户
                this.$axios.get("users.action",{params:this.user}).
                then((response)=> {   //异步调用成功执行
                    //将查询到的数据存入对象数组中
                    //this.users=response.data.records;
                    this.users=response.data.records;
                    console.log(response.data.records);
                    //this.total = response.data.total;
                    this.loading=false;
                }).catch(function (error) {//异步调用失败执行
                    alert(error);
                });
            },
          audit(id,supplierState){
            let user={
              id:id,
              supplierState:supplierState
            }
            //调用异步，进行审核
            this.$axios.put("audit_for_supplier.action",user)
              .then(res=>{
                if(res.data.x){
                  this.$message.success(res.data.msg);
                }else {
                  this.$message.error(res.data.msg);
                }
                //重新查询一次数据
                this.getData();
              })
              .catch(err=>{
                this.$message.warning(err);
                alert(err);
              })
          },
          handleSizeChange(val) {
            //每页范围
            this.pagesize = val;
            this.getShopData();
          },
          handleCurrentChange(val) {
            //当前页
            this.pageno = val;
            this.getShopData();
          }
        },
        created() {
            this.getData();
        }
    }
</script>

<style scoped>

</style>
